<template>
  <div>
    <div class="app-container">
      <div class="search-container">
        <!-- <el-table :data="tableData" style="width: 100%">
          <el-table-column prop="permissionId" label="权限编号" />
          <el-table-column prop="permissionName" label="权限名称" />
          <el-table-column prop="permissionUrl" label="权限路由" />
        </el-table> -->
        <el-table :data="tableData" style="width: 100%; margin-bottom: 20px" row-key="id" border default-expand-all>
          <el-table-column prop="permissionId" label="权限编号" sortable />
          <el-table-column prop="permissionName" label="权限名称" sortable />
          <el-table-column prop="permissionUrl" label="权限路由" sortable />
        </el-table>
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import PermissionAPI from '@/api/PermissionsManagement/index'

const form = reactive({
  RoleName: "",
})

//获取角色列表
const tableData = ref([])
const getPermission = () => {
  PermissionAPI.getPermissionList(0).then((res: any) => {
    tableData.value = res.data
    console.log(res.data)
  })
}

//生命周期
onMounted(() => {
  getPermission()
})
</script>